<template>
  <div>
    <div style="display: flex;justify-content: center;margin-top: 30px">
      <el-card style="width: 80%;margin: 10px">
        <div style="display: flex;border-bottom: 2px solid #8c8c8c">
          <div style="flex: 1;height: 50px;font-size: 25px">累计注册用户数：<span style="color: #409EFF">{{
              count
            }}</span>
          </div>
        </div>
        <div style="display: flex;align-items: center;justify-content: center;margin-top: 10px">
        </div>
      </el-card>
    </div>
    <div style="display: flex;align-items: center;justify-content: center;">
      <el-card style="width: 80%;margin-top: 30px">
        <div style="height: 50px;font-size: 25px">系统用户日注册数量</div>
        <el-table :data="registerData" stripe
                  :header-cell-style="{backgroundColor:'aliceblue',color:'#666'}" style="border-radius: 10px">
          <el-table-column prop="day" label="日期"></el-table-column>
          <el-table-column prop="amount" label="数量"></el-table-column>
        </el-table>
      </el-card>
    </div>
  </div>
</template>

<script>
export default {
  name: "registerCount",
  data() {
    return {
      registerData: [],
      count:0
    };
  },
  methods: {
    loadRe() {
      this.$request.get('/user_register_num/').then(res => {
        if (res.code === '200') {
          this.registerData = res.data.list
          this.count = res.data.total
        } else if (res.code === '501') {
        } else {
          this.$message.error(res.msg)
        }
      })
    },
  },
  created() {
    this.loadRe()
  },
}
</script>

<style scoped>

</style>